layui.use(['layer', 'table'], function () {
  var layer = layui.layer, //弹层
    table = layui.table //表格

  //执行一个 table 实例
  var tableInit = table.render({
    id: 'dataSource',
    elem: '#dataSourceTable',
    // height: 'full-250',
    url: '/code/db/page', //数据接口,
    title: '数据库表',
    page: true, //开启分页,
    parseData: function (res) { //res 即为原始返回的数据
      return {
        'code': res.code, //解析接口状态
        'msg': res.msg, //解析提示文本
        'count': res.data.total, //解析数据长度
        'data': res.data.records //解析数据列表
      }
    },
    even: false, //开启隔行背景
    toolbar: '#dataSourceToolbar', //开启工具栏，此处显示默认图标，可以自定义模板，详见文档,
    totalRow: false, //开启合计行,
    cols: [
      [ //表头
        {
          type: 'checkbox',
          fixed: 'left'
        },
        {
          field: 'alias',
          width: 160,
          title: '别名',
          sort: true,
          fixed: 'left'
        },
        {
          field: 'dbDriver',
          width: 300,
          title: '数据库驱动'
        },
        {
          field: 'dbUrl',
          title: '数据库地址',
          sort: true
        },
        // {
        //   field: 'dbUserName',
        //   width: 120,
        //   title: '数据库账户',
        //   sort: true
        // },
        // {
        //   field: 'dbPassword',
        //   width: 100,
        //   title: '连接密码',
        //   templet: function (d) {
        //     return "********"
        //   }
        // },
        {
          field: 'dbType',
          width: 120,
          title: '数据库类型',
          sort: true
        },
        {
          fixed: 'right',
          width: 265,
          title: '操作',
          align: 'center',
          toolbar: '#dataSourceBar'
        }
      ]
    ]
  })

  var $ = layui.$

  //监听头工具栏事件
  table.on('toolbar(dataSourceFilter)', function (obj) {
    var checkStatus = table.checkStatus(obj.config.id),
      data = checkStatus.data //获取选中的数据
    switch (obj.event) {
      case 'add':
        $.get('/code/db/add', {}, function (str) {
          layer.open({
            type: 1,
            title: '新增数据源',
            area: '60%',
            content: str //注意，如果str是object，那么需要字符拼接。
          })
        })
        break
      case 'delete':
        if (data.length === 0) {
          layer.msg('请选择一行')
        } else {
          data.forEach(row => {
            //向服务端发送删除指令
            $.post('/code/db/delete/' + row.id, function (response) {
              layer.msg(response.data, {
                time: 1000,
                icon: 1
              })
              tableInit.reload()
            })
          })
          refreshDataSource()
        }
        break
    }
  })

  //监听行工具事件
  table.on('tool(dataSourceFilter)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
    var data = obj.data, //获得当前行数据
      layEvent = obj.event //获得 lay-event 对应的值
    if (layEvent === 'test') {
      $.ajaxSetup({
        contentType: 'application/json;charset=utf-8'
      });
      data.searchType = 'list'
      $.post('/code/db/test', JSON.stringify(data), function (response) {
        layer.msg(response.data ? response.data : response.msg, {
          time: 1000,
          icon: response.data ? 1 : 2
        })
      }, 'json')
    } else if (layEvent === 'del') {
      layer.confirm('真的删除行么', function (index) {
        obj.del() //删除对应行（tr）的DOM结构
        layer.close(index)
        //向服务端发送删除指令
        $.post('/code/db/delete/' + data.id, function (response) {
          layer.msg(response.data, {
            time: 1000,
            icon: 1
          })
          tableInit.reload()
          refreshDataSource()
        })
      })
    } else if (layEvent === 'edit') {
      $.get('/code/db/update', { id: data.id }, function (str) {
        layer.open({
          type: 1,
          title: '修改数据源',
          area: '60%',
          content: str //注意，如果str是object，那么需要字符拼接。
        })
      })
    }
  })
})
